<template>
    <div>
        <div v-if="dept == 1" class="personalInfo">
            <img :src="userPhoto ? userPhoto : '/static/images/manage.png'" />
            <div>
                <div class="user-name">{{ user.userName }}</div>
                <div class="user-dept">{{ user.facultyI18n || user.deptOrMajor }}</div>
                <div class="user-major" v-if="global.isStudent">
                    {{ user.deptOrMajor + '专业' }}
                </div>
                <div class="last-login-time">
                    <span>上次登录：</span>
                    {{ lastLoginTime }}
                </div>
                <div class="last-login-time">
                    <span>当前登录IP地址：</span>
                    {{ ip }}
                </div>
                <div class="calender">
                    {{ calendarInfoObj && calendarInfoObj.simpleName
                    }}{{ (calendarInfoObj && calendarInfoObj.whichWeek) || '' }}
                </div>
            </div>
        </div>
        <div v-else class="personalInfomation">
            <img :src="userPhoto ? userPhoto : '/static/images/manage.png'" />
            <div class="baseMessage">
                <div class="user-name">{{ user.userName }}</div>
                <div class="user-dept">{{ user.facultyI18n || user.deptOrMajor }}</div>
                <div class="user-major" v-if="global.isStudent">
                    {{ user.deptOrMajor?user.deptOrMajor + '专业':'' }}
                </div>
            </div>
            <div class="otherInfo">
                <div class="calender">
                    {{ calendarInfoObj && calendarInfoObj.simpleName
                    }}{{ (calendarInfoObj && calendarInfoObj.whichWeek) || '' }}
                </div>
                <div class="last-login-time">
                    <span>上次登录：</span>
                    <div class="numer">
                      {{ lastLoginTime }}
                    </div>
                </div>
                <div class="last-login-time">
                    <span>当前登录IP地址：</span>
                    <div class="numer">
                      {{ ip }}
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import { findUserInfoByIdType, findLocalUserById, findUserInfoByType } from 'common/src/api/user'
import { getSessionUser } from 'common/src/api/session'
import { downloadimage } from 'common/src/api/upload'
import utils from 'common/src/utils/utils'
import mixin from 'common/src/mixins/index';
export default {
    name: 'PersonalInfoCard',
    mixins: [mixin],
    props: {
        isAdaptive: {
            type: Boolean,
        },
        calendarInfoObj: {
            type: Object,
            default: null,
        },
        dept: {
            type: String,
            default: 1,
        },
    },
    data() {
        return {
            user: {
                userName: '',
            },
            lastLoginTime: '', // 上次登录时间
            userPhoto: '', // 用户头像
            type: '',
            ip: '',
        }
    },
    created() {
        this.getUser()
        // 处理展示字段
    },
    watch: {
        calendarInfoObj: function (val) {
            if (val) {
                let week = this.calendarInfoObj.week
                if (week)
                    this.calendarInfoObj.whichWeek = utils.i18nReplace(
                        this.$t('schoolCalendar.whichWeek'),
                        { week }
                    )
            }
        },
    },
    methods: {
        getUser() {
            getSessionUser().then((res) => {
                if (res.code == 200) {
                    let curUser
                    if (res.data.mockUser != null) curUser = res.data.mockUser
                    else curUser = res.data.user
                    this.lastLoginTime = curUser.lastLoginTime
                    this.type = curUser.type
                    this.ip = curUser.ip
                    this.getUserInfo(curUser)
                }
            })
        },
        // 获取个人信息方法
        async getUserInfo(curUser) {
            try {
                let user = {}
                let resUser, userImg
                let uid = curUser.uid
                let query = 'userId=' + curUser.uid + '&type=' + curUser.type
                if (curUser && curUser.type == '3') {
                    // 获取本地用户信息
                    resUser = await findLocalUserById('userId=' + uid)
                    if (resUser.code === 200) {
                        // 获取本地用户图片地址等
                        userImg = await findUserInfoByType(query)
                        if (userImg.code === 200) {
                            user = Object.assign(resUser.data, userImg.data)
                            if (user.photoPath) this.getUserimage(user.photoPath)
                        }
                    }
                } else {
                    // 获取学生教师用户信息
                    resUser = await findUserInfoByIdType(query)
                    if (resUser.code === 200) {
                        // 获取本地用户图片地址等
                        userImg = await findUserInfoByType(query)
                        if (userImg.code === 200) {
                            user = Object.assign(resUser.data, userImg.data)
                            if (user.photoPath) this.getUserimage(user.photoPath)
                        }
                    }
                }
                this.user = user
            } catch (err) {
                // this.$message({
                //     type: 'error',
                //     message: '获取个人信息失败.',
                // })
                console.log(err)
            }
        },
        getUserimage(photo) {
            downloadimage(photo)
                .then((res) => {
                    if ((res.code = 200)) {
                        if (res && res.data) {
                            this.userPhoto = res.data.base
                        } else {
                            this.userPhoto = ''
                        }
                    }
                })
                .catch((error) => {
                    console.log(error, 'error')
                    this.userPhoto = ''
                })
        },
        getDateStr(d) {
            return new Date(d).toLocaleDateString()
        },
    },
}
</script>
<style lang="scss" scoped>
.personalInfo {
    width: 340px;
    padding: 32px 0;
    display: flex;
    font-size: 12px;
    align-items: center;
    img {
        width: 81px;
        height: 81px;
        border-radius: 80px;
        margin-right: 16px;
    }
    span {
        color: #8896a7;
    }
    div {
        margin-bottom: 3px;
    }
    .user-name {
        font-size: 18px;
        font-weight: 600;
    }
    .user-dept {
        color: #8896a7;
    }
    .calender {
        font-size: 14px;
        color: #2b3b4e;
        font-weight: bold;
    }
}
.personalInfomation{
    display: flex;
    font-size: 12px;
    align-items: center;
    img {
        width: 64px;
        height: 64px;
        border-radius: 32px;
        margin-right: 24px;
    }
    span {
        color: #8896a7;
    }
    .baseMessage{
      display: flex;
      flex: 1;
      flex-direction: column;

    }
    .otherInfo{
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      .numer{
        font-weight: 600;
      }
    }
    div {
        margin-bottom: 3px;
    }
    .user-name {
        font-size: 18px;
        font-weight: 600;
        margin-bottom: 8px;
    }
    .user-dept {
        color: #4C5C70;
        margin-bottom: 8px;
    }
    .last-login-time{
      display: flex;
      flex-direction: row;
      margin-bottom: 8px;
    }
    .calender {
        font-size: 14px;
        color: #2b3b4e;
        font-weight: bold;
        margin-bottom: 13px;
    }
}
</style>